<template>
  <div class="tabs-container">
    <div class="tab-content">
      <div id="tab-1" class="tab-pane active">
        <h4 class="title-ele overhaul-tit">使用信息</h4>
        <div class="row overhaul">
          <!-- Elevator Name -->
          <el-row class="row">
            <el-col :span="12">
              <el-descriptions :border="false" title="电梯名称">
                <el-descriptions-item>{{ elevator.elevatorName }}</el-descriptions-item>
              </el-descriptions>
            </el-col>

            <!-- Elevator Number Code -->
            <el-col :span="12">
              <el-descriptions :border="false" title="电梯编码">
                <el-descriptions-item>{{ elevator.numberCode }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
          </el-row>
          <el-row class="row">
            <!-- Elevator Registered Code -->
            <el-col :span="12">
              <el-descriptions :border="false" title="电梯注册码">
                <el-descriptions-item>{{ elevator.registeredCode }}</el-descriptions-item>
              </el-descriptions>
            </el-col>

            <!-- Elevator Identify Code -->
            <el-col :span="12">
              <el-descriptions :border="false" title="电梯识别码">
                <el-descriptions-item>{{ elevator.identifyCode }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
          </el-row>
          <el-row class="row">
            <!-- Elevator Brand -->
            <el-col :span="12">
              <el-descriptions :border="false" title="电梯品牌">
                <el-descriptions-item>{{ elevator.elevatorBrand }}</el-descriptions-item>
              </el-descriptions>
            </el-col>

            <!-- Elevator Layer Number -->
            <el-col :span="12">
              <el-descriptions :border="false" title="层站">
                <el-descriptions-item>{{ elevator.layerNum }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
          </el-row>
        </div>
        <div class="row overhaul no-border">
          <!-- First Row -->
          <el-row class="row">
            <!-- Installation Date -->
            <el-col :span="12">
              <el-descriptions :border="false" title="安装日期">
                <el-descriptions-item>{{ elevator.installationDate }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
            <!-- Annual Date -->
            <el-col :span="12">
              <el-descriptions :border="false" title="年检日期">
                <el-descriptions-item>{{ elevator.annualDate }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
          </el-row>

          <!-- Second Row -->
          <el-row class="row">
            <!-- Use Unit -->
            <el-col :span="12">
              <el-descriptions :border="false" title="使用单位">
                <el-descriptions-item>{{ elevator.useUnit }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
            <!-- Elevator Administrator -->
            <el-col :span="12">
              <el-descriptions :border="false" title="电梯管理员">
                <el-descriptions-item>{{ elevator.elevatorAdministrator }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
          </el-row>

          <!-- Third Row -->
          <el-row class="row">
            <!-- Maintenance Unit -->
            <el-col :span="12">
              <el-descriptions :border="false" title="维保单位">
                <el-descriptions-item>{{ elevator.maintenanceUnit }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
            <!-- Maintenance Engineer -->
            <el-col :span="12">
              <el-descriptions :border="false" title="维保工程师">
                <el-descriptions-item>{{ elevator.maintenanceEngineer }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
          </el-row>

          <!-- Fourth Row -->
          <el-row class="row">
            <!-- Network Date -->
            <el-col :span="12">
              <el-descriptions :border="false" title="入网日期">
                <el-descriptions-item>{{ elevator.networkDate }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
          </el-row>
        </div>
      </div>
    </div>
  </div>
</template>

<script lang="ts" name="ElevatorBaseInfo" setup>
let props = defineProps({
  elevator: {
    type: Object,
    required: true
  }
});
</script>

<style scoped>
</style>